'use strict';
var React = require('react');
var ReProcessBar = require('./ReProcessBar.jsx');
var ReButton = require('./ReButton.jsx');
class HkfsProductItem extends React.Component {
    constructor(props) {
        super(props);
        this.buyProduct=this.buyProduct.bind(this);
    }

    buyProduct() {
       // alert(this.props.id);
    }

    render() {
        var content = this.props;
        return (
            <div className="HkfsProductItem_Container">
                <div className="HkfsProductItem_Title">
                    <div className="HkfsProductItem_Title_Main">{content.mainTitle}</div>
                    <div className="HkfsProductItem_Title_Introduce">{content.introduce}</div>
                </div>
                <div className="HkfsProductItem_Content">
                    <div className="HkfsProductItem_Name"><a href={"/productDetail?parId="+content.parId}>{content.name}</a></div>
                    <div className="HkfsProductItem_ProfitTitle">预期年化收益率</div>
                    <div className="HkfsProductItem_Profit">{content.profit}</div>
                </div>

                <div className="HkfsProductItem_ProfitContent">
                    <div className="HkfsProductItem_SingleContent left">
                        <div className="Content_Value">{content.originCount}</div>
                        <div className="Content_Title">起购金额</div>
                    </div>
                    <div className="HkfsProductItem_SingleContent_S">
                        <div className="Content_Value">{content.term}</div>
                        <div className="Content_Title">期限</div>
                    </div>
                    <div className="HkfsProductItem_SingleContent right">
                        <div className="Content_Value">{content.financingAmount}</div>
                        <div className="Content_Title">融资金额</div>
                    </div>
                </div>

                <div className="HkfsProductItem_ProcessTitle">
                    <div className="HkfsProductItem_ProcessDisplay left">募集进度</div>
                    <div className="HkfsProductItem_ProcessValue right">{'剩余额度:' + content.surplusCount}</div>
                </div>
                <div className="HkfsProductItem_ProcessBar">
                    <ReProcessBar reClass="ReProcessBar_Font" isShowText={true} process={content.process}></ReProcessBar>
                </div>

                <div className="HkfsProductItem_ButtonGroup">
                    <ReButton reClass="HkfsProductItem_Button" reButtonClick={this.props.onItemButtonClick.bind(this,this.props.id)}>立即购买</ReButton>
                </div>
            </div>
        );
    }
}

module.exports = HkfsProductItem;